.custom_circle{
    type: "circle";
    r: 14;
    /* z-index: -1 ; */
    -webkit-animation: circleLiving 2s linear  infinite;
}
.subwayLineLevel1 {
    animation:warning-level1 2s ease-out infinite forwards;
}
.subwayLineLevel2 {
    animation:warning-level2 2s ease-out infinite forwards;
}
.subwayLineLevel3 {
    animation:warning-level3 2s ease-out infinite forwards;
}
.subwayLineLevel4 {
    animation:warning-level4 2s ease-out infinite forwards;
}


.fill_Level1{
    fill: green;
}
.fill_Level2{
    fill: yellow;
}
.fill_Level3{
    fill: orange;
}
.fill_Level4{
    fill: red;
}


@keyframes circleLiving {
    0%{
        r: 14;
        /* transform: scale(1); */
        opacity: 0.9;
    }
    50%{
        r: 19;
        /* transform: scale(1.5);   */
        opacity: 0;   /*圆形放大的同时，透明度逐渐减小为0*/
    }
    100%{
        r: 14;
        /* transform: scale(1); */
        opacity: 0.9    ;
    }
}

@keyframes warning-level1{
    0% {
        opacity:0.2;
    }
    50% {
        opacity:0.5;
    }
    100% {
        opacity:1; stroke:green;
    }
}
@keyframes warning-level2{
    0% {
        opacity:0.2;
    }
    50% {
        opacity:0.5;
    }
    100% {
        opacity:1; stroke:yellow;
    }
}
@keyframes warning-level3{
    0% {
        opacity:0.2;
    }
    50% {
        opacity:0.5;
    }
    100% {
        opacity:1; stroke:orange;
    }
}
@keyframes warning-level4{
    0% {
        opacity:0.2;
    }
    50% {
        opacity:0.5;
    }
    100% {
        opacity:1; stroke:red;
    }
}

